<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title> 学生信息管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="../assets/layui/css/layui.css" media="all"/>
</head>
<body style="margin: 50px">


<div class="layui-input-inline">

    <form class="layui-form" method="post">
        <div class="layui-inline">
            <div class="layui-form-item">

                <div id="cat_ids2">
                </div>

            </div>
        </div>

        <div class="layui-inline">
            <div class="layui-form-item">
                <input type="text" id="unumber" name="unumber" lay-verify="unumber" autocomplete="off"
                       class="layui-input"
                       placeholder="学号">
            </div>
        </div>
        <div class="layui-input-inline">
            <div class="layui-form-item">
                <input type="text" id="uname" name="uname" lay-verify="uname" autocomplete="off"
                       class="layui-input"
                       placeholder="姓名">
            </div>
        </div>
        <div class="layui-input-inline">
            <div class="layui-form-item">
                <button type="button" class="layui-btn" lay-submit="" lay-filter="demo">提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                <button type="button" class="layui-btn layui-btn-normal" id="add">添加</button>
            </div>
        </div>
    </form>

</div>
<table class="layui-hide" id="test" lay-filter="users"></table>

</body>


<script type="text/javascript" src="../assets/layui/layui.js"></script>
<script type="text/javascript" src="../assets/jquery.min.js"></script>
<script type="text/javascript" src="../assets/bootstrap-3.3.7/js/bootstrap.js"></script>
<script type="text/html" id="bar">
    <button type="button" class="layui-btn layui-btn-xs layui-btn-normal" id="more" lay-event="more">详情</button>
    <button type="button" class="layui-btn layui-btn-xs layui-btn-normal" id="update" lay-event="update">修改</button>
    <button type="button" class="layui-btn layui-btn-xs layui-btn-normal" id="del" lay-event="del">删除</button>
</script>
<script>
    $("#add").click(function () {
        var index = layer.open({
            type: 2,
            title: "学生添加页面",
            area: ['100%', '100%'],
            maxmin: true,
            shadeClose: true,
            shade: 0.4,
            skin: 'layui-layer-rim',
            content: ["./studentadd.html"],
        });

    })
    getMajors()
   function getMajors() {
       let catData
       // 异步查询
       $.ajax({
           type: "post",
           contentType: "application/x-www-form-urlencoded",
           url: "/api/v1/admin/majormenu",
           data: {},
           dataType: "json",
           async: false,
           success: function (data) {
               catData = data
               showmajor(catData)
           }
       });

   }

    function showmajor(catData) {

        layui.config({
            base: './'
        }).extend({
            selectN: '../assets/layui/layui_extends/selectN',
            selectM: '../assets/layui/layui_extends/selectM',
        }).use(['layer', 'form', 'jquery', 'selectN', 'selectM'], function () {
            $ = layui.jquery;
            var form = layui.form
                , selectN = layui.selectN
                , selectM = layui.selectM;


            //无限级分类-所有配置
            var catIns2 = selectN({
                //元素容器【必填】
                elem: '#cat_ids2'
                //候选数据【必填】
                , data: catData
                //设置了长度
                , width: null
                //默认值
                , selected: [6, 10, 11]

                , tips:['专业','班级']
                //为真只取最后一个值
                , last: true

                //事件过滤器，lay-filter名 不设置与选择器相同(去#.)
                , filter: ''

                //input的name 不设置与选择器相同(去#.)
                , name: 'cat2'

                //数据分隔符
                , delimiter: ','

                //数据的键名
                , field: {idName: 'id', titleName: 'name', childName: 'children'}

                //表单区分 form.render(type, filter); 为class="layui-form" 所在元素的 lay-filter="" 的值
                , formFilter: null

            });

            form.on('submit(demo)', function (data) {


                showtable(data.field.uname,data.field.unumber,catIns2.lastValue,catIns2.values[0])

            })


            //通过js动态选择
            $('.set1').click(function () {
                catIns1.set([6, 10]);

            });


            //监听重置按钮
            $('form').find(':reset').click(function () {
                $('form')[0].reset();
                catIns2.set();//默认值
                showtable()
                return false;
            });


        });

    }


    showtable()
    function showtable(name,unumber,classid,majorid) {
        var table
        layui.use(['form', 'table', 'layer', 'laydate'], function () {
            var form = layui.form
            table = layui.table;


            // 获取数据
            showtable()

            function showtable(ftime, ltime, number, uname, istoday, tempup) {

                table.render({
                    elem: '#test'
                    , url: '/api/v1/admin/showstudentinfo'
                    , toolbar: true
                    , title: '学生信息'
                    , totalRow: true
                    , cols: [[
                        {field: 'id', title: 'ID', fixed: 'left', unresize: true, sort: true}
                        , {field: 'number', title: '学号', edit: 'number', sort: true}
                        , {field: 'name', title: '姓名', edit: 'text', sort: true}
                        , {field: 'phone', title: '电话', edit: 'text', sort: true}
                        , {field: 'ctime', title: '入学时间', edit: 'text', sort: true}
                        , {field: 'gtime', title: '毕业时间', edit: 'text', sort: true}
                        , {field: '', title: '操作', toolbar: "#bar"}

                    ]]
                    , page: true
                    , response: {
                        statusCode: 200 //重新规定成功的状态码为 200，table 组件默认为 0
                    }
                    , where: {
                        "name": name,
                        "number": unumber,
                        "classid": classid,
                        "majorid": majorid,
                        "isdel":'0'
                    }


                });
            }

            table.on('tool(users)', function (obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
                var data = obj.data; //获得当前行数据
                var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
                var tr = obj.tr; //获得当前行 tr 的DOM对象
                switch (layEvent) {
                    case 'del':
                        var delIndex = layer.confirm('真的删除id为' + data.id + "的学生信息吗?", function(delIndex) {
                            $.ajax({
                                url: '/api/v1/student/del?id='+data.id,
                                type: "post",
                                success: function(suc) {
                                    if(suc.resultTypeEnum == 200) {
                                        obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                                        layer.close(delIndex);
                                        console.log(delIndex);
                                        layer.msg("删除成功", {
                                            icon: 1
                                        });
                                    } else {
                                        layer.msg("删除失败", {
                                            icon: 5
                                        });
                                    }
                                }
                            });
                            layer.close(delIndex);
                        });

                        break
                    case 'update':
                        var index = layer.open({
                            type: 2,
                            title: "学生信息修改页面",
                            area: ['100%', '100%'],
                            maxmin: true,
                            shadeClose: true,
                            shade: 0.4,
                            skin: 'layui-layer-rim',
                            content: ["/studentinfoupdate?id="+data.id],
                        });
                        break
                    case 'more':
                        var index = layer.open({
                            type: 2,
                            title: "学生信息详情页面",
                            area: ['30%', '60%'],
                            maxmin: true,
                            shadeClose: true,
                            shade: 0.4,
                            skin: 'layui-layer-rim',
                            content: ["/studentinfo?id="+data.id],
                        });
                        break
                }

            });


        });
    }


</script>


</body>
</html>